<template>
	<view class="detail-item">
		<view class="item-title" :class="isBold ? 'bold' : 'weight'">{{ title }}</view>
		<view class="item-intro intro_txt" :class="isDown ? 'heightMy' : ''">
			<image v-if="title == '产品说明'" :src="img_src" style="width: 100%" mode="widthFix"></image>
		</view>
		<!-- <view class="item-down" v-if="showDown" @click="down">
			<text class="down-txt" v-if="isDown">展开</text>
			<text class="down-txt" v-if="!isDown">收起</text>
		</view> -->
	</view>
</template>

<script>
export default {
	props: {
		title: '',
		content: '',
		isBold: false,
		img_src:''
	},
	data() {
		return {
			isDown: false,
			showDown: true,
			isCollect: false
		};
	},
	methods: {
		down() {
			this.isDown = !this.isDown;
		},
		collect() {
			this.isCollect = !this.isCollect;
		}
	}
};
</script>

<style lang="scss">
.heightMy {
	height: 210rpx;
	overflow: hidden;
}
.bold {
	font-weight: bold;
	color: #000 !important;
}
.weight{
	color: #000 !important;
    font-weight: 700;
}
.detail-item {
	background-color: #ffffff;
	border-radius: 26rpx;
	margin-bottom: 20rpx;
	padding: 30rpx;
	display: flex;
	flex-wrap: wrap;
	position: relative;
	.item-title {
		width: 100%;
		color: #aaa;
		margin-bottom: 20rpx;
	}
	.item-intro {
		width: 100%;
		line-height: 50rpx;
	}
	.item-down {
		width: 100%;
		text-align: right;
		.down-txt {
			color: #06b4fd;
			text-align: right;
		}
	}
}
</style>
